{% extends 'root.html' %}

{% block root_content %}
    <table>
        <tr>
    {% for album in albums %}
		    <td>
		        <div class="album_cover">
		            <a href="{% url remove_album album.id %}" onclick="return askConfirmation();">Remove</a>
                    <a href="{% url show_album album.id %}"><img
                    alt="{{album.description}}"
                    src="{{album.cover_picture.uri}}"></a>
                    <a href="{% url show_album album.id%}">{{album.name}}</a>
                </div>
		    </td>
        {% if forloop.counter|divisibleby:4 and not forloop.last%}
        </tr><tr>
        {% endif %}
    {% empty %}
        <td>Could not find any albums.</td>
        {% if user.is_authenticated and user.is_active %}
        <td><a href="{% url add_album %}">Create a new one</a></td>
        {% endif %}
    {% endfor %}
        </tr>
    </table>

<script type="text/javascript">
    function askConfirmation() {
         return confirm("Are you sure you want to delete album?");
    }
</script>
{% endblock %}

